<template>
  <div class="about">
    <img class="titleImg" src="@/assets/img/headerImg.png" alt="">
    <div class="commonWrapper">
      <div class="aboutInfo">
        <div>
          <p>
            <img src="@/assets/icon/a1.png" alt=""> <span>电话：{{footerInfo.site_phone}}</span>
          </p>
          <p>
            <img src="@/assets/icon/a2.png" alt=""> <span>投递邮箱：{{footerInfo.site_mail}}</span>
          </p>
          <p>
            <img src="@/assets/icon/a3.png" alt=""> <span>传真：{{footerInfo.fax_no}}</span>
          </p>
          <p>
            <img src="@/assets/icon/a4.png" alt=""> <span>邮编：{{footerInfo.postcode}}</span>
          </p>
          <p>
            <img src="@/assets/icon/a5.png" alt=""> <span>时间：{{footerInfo.work_time}}</span>
          </p>
          <p>
            <img src="@/assets/icon/a6.png" alt=""> <span>{{footerInfo.site_address}}</span>
          </p>
        </div>
        <div>
          <img :src="$api.picPre + footerInfo.wx_qr_code" alt="">
          <img :src="$api.picPre + footerInfo.wb_qr_code" alt="">
        </div>
      </div>
      <mapshow></mapshow>
    </div>
  </div>
</template>
<script>
import mapshow from '@/components/map/index'
export default {
  name: 'about',
  components: {
    mapshow
  },
  data () {
    return {
      footerInfo: {}
    }
  },
  methods: {
    getFooter () {
      this.$ajax
        .get(this.$api.getConfigInfo)
        .then(res => {
          this.footerInfo = res
          console.log(this.footerInfo)
        })
        .catch(err => {
          this.$message({
            message: err,
            type: 'warning'
          })
        })
    }
  },
  created () {
    this.getFooter()
  }
}
</script>
<style scoped lang="scss">
  .titleImg{
    width: 100%;
  }
  .aboutInfo{
    padding: 78px 0 !important;
    @include flex_content;
    @include flex_justify_space;
    @include flex_align_center;
    p{
      line-height: 52px;
      img{
        vertical-align: middle;
        margin-right: 18px;
      }
      span{
        font-size:24px;
        font-family:PingFang SC;
        font-weight:500;
        color:rgba(51,51,51,1);
      }
    }
    div{
      > img:first-child{
        margin-right: 100px;
      }
    }
  }

</style>
